$(document).ready(function(){
	applyEventComponent();
});

function applyEventComponent() {
	if($('.event_component').length <= 0) {
		return;
	}
	var html = '' 
		+ '<table id="tblEvent" class="table hide closeuicontainer">'
		+ '  <tr>'
		+ '    <td colspan="3" class="bottomborder "><strong>' + label_component_events_title + '</strong><div id="_btnClose" style="display: none;" class="closeuiicon" onclick="$(\'#tblEvent\').hide();" ></div></td>'
		+ '  </tr>'
		+ '  <tr>'
		+ '    <td width="70%" class="valigntop"><div class="scrollbox eventlist_box"><table class="table">'
        + '    <tbody id="tblEventList"></tbody>'
        + '    <tfoot id="tblEventListMore"></tfoot>'
        + '    </table></div></td>'
        + '    <td width="5" class="rightborder">&nbsp;</td>'
        + '    <td width="30%" align="left" valign="top"><div class="scrollbox eventpossibilitieslist_box"><table class="table">'
        + '      <tr>'
        + '        <td colspan="2" align="left" class="bottomborder" style="margin-bottom: 2px;" ><label id="lblEventDetailDescription">&nbsp;</label></td>'
        + '      </tr>'
        + '      <tbody id="tblEventPosibilities"></tbody>'
        + '    </table></div></td>'
        + '  </tr>'
        + '</table>';
	$('.event_component').html(html);
	$('.closeuicontainer').mouseenter(function(){
		$(this).find('[id=_btnClose]').show();
	}).mouseleave(function(){
		$(this).find('[id=_btnClose]').hide();
	});
}

var eventInfoList = null;
var eventParams = null;
function chooseEvent(hasSelect, params, append, indexPage) {
	var datas = {'pagingInfo.indexPage': append?indexPage:0};
	if(params == null || params.length <= 0) {
		if(eventParams != null) {
			params = eventParams;
		}
	} else {
		eventParams = params;
	}
	if(params && params.length > 0) {
		for(var i = 0; i < params.length; i++) {
			var param = params[i];
			datas[param[0]] = param[1];
		}
	}
	$.ajax({
		url : LISTEVENT_AJAX_URL,
		dataType : 'json',
		data: datas,
		success : function(data) {
			if(data.eventInfoList == null) {
				$('.event_component').html("");
				return;
			}
			if($('#tblEvent').length <= 0) {
				applyEventComponent();
			}
			if(append) {
				if (data.eventInfoList !== null && data.eventInfoList.length > 0) {
					for ( var i = 0; i < data.eventInfoList.length; i++) {
						var eventInfo = data.eventInfoList[i];
						eventInfoList.push(eventInfo);
					}
				}
			} else {
				eventInfoList = data.eventInfoList;
			}
			if (data.eventInfoList !== null && data.eventInfoList.length > 0) {
				var html = '';
				var currentEventId = $('#_eventId').val();
				for ( var i = 0; i < data.eventInfoList.length; i++) {
					var eventInfo = data.eventInfoList[i];
					var imagePath = getImage(eventInfo.imagePath);
					html = html
							+ '<tr onmouseover="__swap(this)" onmouseout="__reSwap(this)">'
							+ '<td><table width="100%" border="0" onmouseover="__swap(this)" onmouseout="__reSwap(this)">'
							+ '  <tr>'
							+ '    <td width="65" rowspan="3" align="left" valign="top" width="60" height="60"><img src="' + imagePath + '" alt="' + NO_PICTURE_ALT	+ '" width="60" height="60" /></td>'
							+ '    <td colspan="2"><a id="_event_' + eventInfo.eventId + '" href="javascript:showEventDetail(\'' + eventInfo.eventId + '\');" >' + eventInfo.eventContent	+ '</a></td>';
							if(hasSelect) {
								html = html + '    <td width="60" align="center" class="aligncenter"><label>'
									+ '      <input type="checkbox" name="chkSelectEvent1" id="chkSelectEvent1" onclick="chosenEvent(\'' + eventInfo.eventId + '\')" ';
									if (eventInfo.eventId == currentEventId) {
										html = html + ' checked="checked" ';
									}
									html = html
											+ ' />'
											+ '    </label></td>';
							}
							html = html + '  </tr>'
							+ '  <tr>'
							+ '    <td width="75">' + label_component_event_startdate + '</td>'
							+ '    <td width="130" align="right" class="alignright">' + eventInfo.startDateStr + '</td>';
							if(hasSelect) {
								html = html + '    <td align="center" class="aligncenter">'	+ eventInfo.betCount + '</td>'
							}
							html = html + '  </tr>'
							+ '  <tr>'
							+ '    <td>' + label_component_event_enddate + '</td>'
							+ '    <td align="right" class="alignright">' + eventInfo.endDateStr + '</td>';
							if(hasSelect) {
								html = html + '    <td align="center" class="aligncenter">' + label_component_event_bets + '</td>'
							}
							html = html + '  </tr>'
							+ '</table></td>'
							+ '</tr>';
				}
				var pagingInfo = data.pagingInfo;
				if(pagingInfo && pagingInfo.hasNextPage == true) {
					$('#tblEventListMore').html('' 
							+ '<tr>'
							+ '  <td class="aligncenter"><a href="javascript: chooseEvent(' + hasSelect + ', null, true, ' + (pagingInfo.indexPage + 1) +');">' + pagingInfo.remainingItems + ' ' + label_component_event_more + '</a></td>'
							+ '</tr>');
				} else {
					$('#tblEventListMore').html('');
				}
				if(append) {
					$('#tblEventList').append(html);
				} else {
					$('#tblEventList').html(html);
					if (eventInfoList.length > 0) {
						if (currentEventId != null && currentEventId != '') {
							showEventDetail(currentEventId);
						} else {
							showEventDetail(eventInfoList[0].eventId);
						}
					}
				}
				$('#tblEvent').show();
				$('.event_component').show();
			}
		},
		error : function(xhr, ajaxOptions, thrownError) {
			//alert(xhr.status);
			//alert(thrownError);
		}
	});
}

function showEventDetail(eventId) {
	if (eventInfoList == null || eventInfoList.length == 0) {
		return;
	}
	for ( var i = 0; i < eventInfoList.length; i++) {
		var eventInfo = eventInfoList[i];
		if (eventInfo.eventId == eventId) {
			$('#lblEventDetailDescription').html(eventInfo.description);
			if (eventInfo.posibilityInfoList != null
					&& eventInfo.posibilityInfoList.length > 0) {
				var html = '';
				for ( var j = 0; j < eventInfo.posibilityInfoList.length; j++) {
					var possibilityInfo = eventInfo.posibilityInfoList[j];
					html = html
							+ '<tr>'
							+ '  <td width="200" align="left" class="alignleft">' + possibilityInfo.posibilityName + '</td>'
							+ '  <td width="100" align="right" class="alignright">' + eventInfo.defaultStake + '</td>' + '</tr>';
				}
				$('#tblEventPosibilities').html(html);
				$('[id^="_event_"]').removeClass('event_selected');
				$('#_event_' + eventId).addClass('event_selected');
			}
			break;
		}
	}
}

function chosenEvent(eventId) {
	for ( var i = 0; i < eventInfoList.length; i++) {
		var eventInfo = eventInfoList[i];
		if (eventInfo.eventId == eventId) {
			if (eventInfo.posibilityInfoList != null
					&& eventInfo.posibilityInfoList.length > 0) {
				var html_BettingExchange = '';
				var html_MutualBetting = '';
				for ( var j = 0; j < eventInfo.posibilityInfoList.length; j++) {
					var possibilityInfo = eventInfo.posibilityInfoList[j];
					html_BettingExchange = html_BettingExchange
							+ '<tr>'
							+ '  <td width="40%"><strong>' + possibilityInfo.posibilityName + '</strong><input type="hidden" name="betInfo.betPosInfoList[' + j + '].posibilityName" value="' + possibilityInfo.posibilityName + '"></input>' 
							+ '    <input type="hidden" name="betInfo.betPosInfoList[' + j + '].posId" value="' + possibilityInfo.posibilityId + '"></input></td>'
							+ '  <td align="right" class="alignright" width="50%">'
							+ '    <input name="betInfo.betPosInfoList[' + j + '].oddValue" type="text" value="' + eventInfo.defaultStake + '" size="7" class="alignright"/>'
							+ '  </td>'
							+ '  <td align="right" class="alignright"><input type="checkbox" value="true" name="betInfo.betPosInfoList[' + j + '].active" id="frmAddBet_BettingExchange_betInfo_betPosInfoList_'	+ j	+ '__active" onchange="validateOddValue(\'frmAddBet_BettingExchange\',this);"/>'
							+ '<input type="hidden" name="__checkbox_betInfo.betPosInfoList[' + j + '].active" value="true" id="__checkbox_frmAddBet_BettingExchange_betInfo_betPosInfoList_' + j + '__active"/></td>'
							+ '</tr>';
					html_MutualBetting = html_MutualBetting
							+ '<tr>'
							+ '  <td width="90%"><strong>' + possibilityInfo.posibilityName + '</strong><input type="hidden" name="betInfo.betPosInfoList[' + j + '].posibilityName" value="' + possibilityInfo.posibilityName + '"></input>' 
							+ '    <input type="hidden" name="betInfo.betPosInfoList[' + j + '].posId" value="' + possibilityInfo.posibilityId + '"></input></td>'
							+ '  <td align="right" class="alignright"><input type="checkbox" value="true" name="betInfo.betPosInfoList[' + j + '].active" id="frmAddBet_MutualBetting_betInfo_betPosInfoList_'	+ j	+ '__active" />'
							+ '<input type="hidden" name="__checkbox_betInfo.betPosInfoList[' + j + '].active" value="true" id="__checkbox_frmAddBet_MutualBetting_betInfo_betPosInfoList_' + j + '__active"/></td>'
							+ '</tr>';
				}
				$('#frmAddBet_BettingExchange [id=tblPosibilities]').html(html_BettingExchange);
				$('#frmAddBet_MutualBetting [id=tblPosibilities]').html(html_MutualBetting);
			}
			validatePossibilities();
			displayEventDetail(eventInfo);
			lockForm(false);
			$('#tblEvent').hide();
			$('form[id^="frmAddBet_"]').each(function() {
				var name = $(this).attr('name');
				$('#' + name + ' [id=_eventId]').val(eventId);
				$('#' + name + ' [id=regPosibilities]').show();
				if($(this).css('display') != 'none') {
					$('#' + name + ' [id=txtBetName]').focus();
				}
			});
			break;
		}
	}
}

function displayEventDetail(eventInfo) {
	$('#cmdChooseEvent').html(eventInfo.eventContent);
	$('#lblEventDescription').html(eventInfo.description);
	$('#lblEventStartDateLabel').show();
	$('#lblEventStartDate').html(eventInfo.startDateStr);
	$('#hidEventEndDate').val((new Date(eventInfo.endDate)).formatDate(DATE_FORMAT_DATETIMEPICKER_DISPLAY));
	$('#lblEventEndDateLabel').show();
	$('#lblEventEndDate').html(eventInfo.endDateStr);
	if (eventInfo.imagePath != null && eventInfo.imagePath != '') {
		$('#imgEvent').attr('src', ROOT_IMAGE_URL + eventInfo.imagePath);
	}
	$('form[id^="frmAddBet_"]').each(function() {
		var name = $(this).attr('name');
		var betName = $('#' + name + ' [id=txtBetName]');
		if (betName.val() == null || betName.val() == '') {
			betName.val(eventInfo.eventContent);
		}
		var imagePath = $('#' + name + ' [id=_imagePath]');
		if (imagePath.val() == null || imagePath.val() == '') {
			imagePath.val(eventInfo.imagePath);
		}
	});
}